<template>
    <mescroll-uni
        ref="mescrollRef"
        @init="mescrollInit"
        :height="height"
        :down="downOption"
        @down="refresh"
        :up="upOption"
        @up="getData">
        <view>
            <coupon-list-item
                v-for="(item, index) in datas"
                :showSelect="showSelect"
                @goTakeCoupons="goTakeCoupons"
                :selectId="selectId"
                :key="index"
                :item="item"
                :state="param.state"
                @selectFn="selectFn"></coupon-list-item>
        </view>
        <view class="bottom-bar">
            <text class="btn btn-success" @click="oneKey">一键领取</text>
        </view>
    </mescroll-uni>
</template>
<script>
import couponListItem from "@/pages_scan/components/coupon/coupon-list-item.vue"
import { getUserCouponDetailPage } from "@/service/api/coupon.js"
import { GetCouponCenterList, TakeCoupons, TakeCanGetCoupon } from "@/service/api/coupon.js"
export default {
    props: {
        height: {
            type: String,
            default: "",
        },
        data: {
            type: Object,
            default: () => {},
        },
        showSelect: {
            type: Boolean,
            default: false,
        },
        selectId: {
            type: String,
            default: "",
        },
        coupons: {
            type: Array,
            default: null,
        },
    },
    components: {
        couponListItem,
    },
    data() {
        return {
            datas: [],
            productList: [],
            param: {
                buyType: 2,
                isOpenCouponCenter: 1,
            },
        }
    },
    mounted() {
        this.$nextTick(() => {
            //#ifndef MP
            this.refresh()
            //#endif
        })
    },
    methods: {
        getData(page) {
            if (this.coupons) {
                this.mescroll.endBySize(this.coupons.length, this.coupons.length)
                this.datas = this.datas.concat(this.coupons)
            } else {
                let param = this.param
                param.PageIndex = page.num
                param.PageSize = page.size

                GetCouponCenterList(param).then((res) => {
                    if (res.Data && res.Data.Data) {
                        this.mescroll.endBySize(res.Data.Data.length, res.Data.RecordAmout)
                        this.datas = this.datas.concat(res.Data.Data)
                    } else {
                        this.mescroll.endBySize(0, 0)
                    }
                })
            }
        },
        goTakeCoupons(item) {
            let path = "?couponIds=" + item.ID
            TakeCoupons(path).then((res) => {
                if (res.State && res.Data) {
                    this.easyToast("领取成功")
                    setTimeout((e) => {
                        this.refresh()
                    }, 1000)
                }
            })
        },
        oneKey() {
            TakeCanGetCoupon({ buyType: 2, isOpenCouponCenter: 1 }).then((res) => {
                if (res.State == 1 && res.Data) {
                    this.easyToast("领取成功")
                    setTimeout((e) => {
                        this.refresh()
                    }, 1000)
                }
            })
        },
        refresh() {
            this.datas = []
            this.mescroll.resetUpScroll()
        },
        selectFn(id) {
            let selectObj = this.datas.find((e) => {
                return String(e.ID) == id
            })
            this.$emit("selectFn", selectObj)
        },
    },
}
</script>

<style lang="scss">
.bottom-bar {
    .btn {
        width: 100%;
        margin-left: 0;
        height: 88rpx;
        font-size: 32rpx;
        background: linear-gradient(270deg, #f60139 0%, #ff4945 100%);
    }
}
</style>
